<template>
  <div class="header">
    <el-header>
      <div class="title">通用管理系统</div>
      <div>
        <span style="margin-right:20px;">{{ name }}</span>
        <el-button type="danger" @click="loginOut">退出</el-button>
      </div>
    </el-header>
  </div>
</template>
<script>
import {getToken,removeToken} from '@/utils/token'
export default{
  name:'Header',
  data(){
    return{
      name:'',
    }
  },
  created(){
    this.name = getToken('username')
  },
  methods:{
    loginOut(){
      removeToken('username')
      removeToken('token')
      this.$router.push('/login')
    }
  }
}
</script>
<style lang="scss" scoped>

.header{
   .el-header{
     background:#409eff;
     color:#fff;
     line-height:60px;
     display:flex;
     justify-content: space-between;
     .title{
         width:200px;
         font-size:24px;
     }
    }
}


</style>